// console.log("测试+///////////////////////////")

//获取DOM
var user=document.getElementById("user");
var phone=document.getElementById("phone");
var grade=document.getElementById("grade");
var add=document.getElementById("add");
var d2=document.getElementById("d2");
var info=document.getElementById("info");
var TIME=3000;

//判断获取本地存储
;(function(){
	if(localStorage.arr1118){
		var arr=JSON.parse(localStorage.arr1118);
		show(arr);
	}else{
		localStorage.arr1118="[]";
	}
}());

//添加函数
add.onclick=function(){
	if(!user.value){
		infoFn("请输入姓名",TIME);
	}else if(!phone.value){
		infoFn("请输入手机号",TIME)
	}else{
		var obj={
			user:user.value,
			phone:phone.value,
			grade:grade.value,
			id:new Date().getTime()
		}
		// console.log("obj:",obj);
	}
	var arr=JSON.parse(localStorage.arr1118);
	arr.unshift(obj);
	show(arr);
	localStorage.arr1118=JSON.stringify(arr);
}

//渲染函数
function show(arr){
	var arr0=JSON.parse(localStorage.arr1118);
	// console.log("arr0:",arr0);
	if(arr0.length==0){
		d2.classList.add("none")
	}else{
		d2.classList.remove("none")
		var str="";
		for(var i=0;i<arr.length;i++){
			str+=`
			<div>
				<p>${i+1}.姓名:${arr[i].user}</p>
				<div>手机号:${arr[i].phone}</div>
				<div>
					<span>评分:</span>
					${pfFn(arr[i].grade)}
				</div>
				<div>
					上传时间:${time(arr[i].id)}
				</div>
				<div>
					<button type="button" ${i==0?'disabled':'onclick=up("'+arr[i].id+'")'} >上移</button>
					<button type="button" onclick="del(${arr[i].id})">删除</button>
					<button type="button" ${i==arr.length-1?'disabled':'onclick=dow("'+arr[i].id+'")'} >下移</button>
				</div>
			</div>
			`;
		}
		d2.innerHTML=str;
	}
}

//评分函数
function pfFn(n){
	if(n<0){
		n=0
	}else if(n>5){
		n=5
	};
	var str="";
	for(var i=0;i<n;i++){
		str+=`
		<img src="../img/1.png" >
		`;
	}
	for(var j=0;j<5-n;j++){
		str+=`
		<img src="../img/0.png" >
		`;
	}
	return str;
}

//时间函数
function time(id){
	var t=new Date(id);
	// console.log("t:",t);
	var y=t.getFullYear();
	var mon=bu0(t.getMonth());
	var d=bu0(t.getDate());
	var h=bu0(t.getHours());
	var m=bu0(t.getMinutes());
	var s=bu0(t.getSeconds());
	return y+"-"+mon+"-"+d+" "+h+":"+m+":"+s
}
//补0函数
function bu0(n){
	return n<10?"0"+n:n
}

//上移函数
function up(id){
	var arr=JSON.parse(localStorage.arr1118);
	var obj;
	for(var i=0;i<arr.length;i++){
		if(arr[i].id==id){
			obj=arr[i-1];
			arr[i-1]=arr[i];
			arr[i]=obj;
			break
		}
	}
	show(arr);
	localStorage.arr1118=JSON.stringify(arr);
}

//下移函数
function dow(id){
	var arr=JSON.parse(localStorage.arr1118);
	var obj;
	for(var i=0;i<arr.length;i++){
		if(arr[i].id==id){
			obj=arr[i];
			arr[i]=arr[i+1];
			arr[i+1]=obj;
			break
		}
	}
	show(arr);
	localStorage.arr1118=JSON.stringify(arr);
}

//删除函数
function del(id){
	var arr=JSON.parse(localStorage.arr1118);
	var f=confirm("你确定要删除吗");
	if(f){
		for(var i=0;i<arr.length;i++){
			if(arr[i].id==id){
				arr.splice(i,1)
				// console.log("arr:",arr);
			}
		}
		show(arr);
		localStorage.arr1118=JSON.stringify(arr)
	}
}

//info提示函数
function infoFn(str,time){
	info.innerHTML=str;
	info.classList.remove("none");
	var t=setTimeout(function(){
		info.classList.add("none")
	},time);
}